<template>
  <div>
    <div class="v-container">
      <v-header title="服务范围">
        <span class="back" @click="goBack">
          <i class="el-icon-arrow-left"></i>
        </span>
      </v-header>
      <div class="mt">
        <div class="conWrap">
          <div class="con_ele" style="padding-top:0px;border-bottom: 1px solid;position: relative;" v-for="(data,key,index) in RoomList" v-bind:key="index">
            <div class="con g-clearfix" @click="chooseRoomVip(data)">
              <img class="e_img" :src="imgLogo" width="100" :alt="data.h3">
              <div class="c_font" style="margin-top:10px">
                <h3>{{data.secondarySupplierName}}</h3>
                <p>{{data.airportName}}</p>
                <p>{{data.time}}</p>
                <p>{{data.hours}}</p>
              </div>

            </div>
            <div style="position: absolute;right:-10px;bottom:10px" @click="locationDetail(data.detailedAddress)">
              <img src="@/assets/images/3_06.png" height="30" width="70" slot="icon">
              位置
            </div>
          </div>
        </div>
      </div>
    </div>

    <mt-popup v-model="popupVisible" style="width:100%" position="bottom">
      <div id="login-title" style="background-color: #fff;margin-top: 10px;padding:10px">
        <h3 class="h3-style2" style="margin:0px 0px 0px 5px;">位置详情</h3>
      </div>

      <p v-html="detailAddress" style="color:#333;padding:20px"></p>

    </mt-popup>
  </div>
</template>

<script>
const proxy = require('@/env/proxy');
const query_page = proxy.query_page;
import vHeader from "@/components/Header.vue";
import { Resource } from '@/services/resource';
import LocalStorage from '@/services/storage';
import axios from "axios";
import imgLogo from '@/assets/images/3_03.jpg';

export default {
  name: "home",
  components: {
    vHeader
  },
  props: {
    title: {
      type: String,
      default: "标题"
    }
  },
  created() {
    let airportName = this.$route.query.airportName.slice(0,5)
    let param = {
      'pageNum': '1',
      'pageSize': '100',
      'secondarySupplierType': '2',
      'airportName': airportName
    }
    Resource.jsonPost
      .post({}, { 
        url: query_page,
        jsonparams: param
      })
      .then(res => {
        if(JSON.parse(res.body.result).data.dataList.length > 0) {
          this.RoomList = JSON.parse(res.body.result).data.dataList
          console.log('RoomList',this.RoomList)
        }
      })
      .catch(err => {
        console.log(err);
      });

  },
  data() {
    return {
      msg: "Footera",
      dataShow:[
        {
          img:require('@/assets/images/3_03.jpg'),
          h3:"CIP休息室",
          p:"北京首都机场 T1航站楼",
          time: "营业时间：06:30-22:30",
          hours: "服务时间：2小时"
        },
        {
          img:require('@/assets/images/3_03.jpg'),
          h3:"CIP休息室",
          p:"北京首都机场 T1航站楼",
          time: "营业时间：06:30-22:30",
          hours: "服务时间：2小时"
        }
      ],
      RoomList: [],
      popupVisible: false,
      detailAddress: '',
      imgLogo: imgLogo
    };
  },
  mounted() {
    this.loginAuto();
  },
  methods:{
    // 返回上一页
    goBack() {
      this.$router.go(-1)
      this.$router.push({path:'/airportVipForm',query:{airportName:this.$route.query.airportName,bespeakTime:this.$route.query.bespeakTime}})
    },
    submit(){
      // this.$router.replace('equity');
      this.$router.push('equity');
    },
    // 免登录
    loginAuto(){
      let loginStatus = LocalStorage.getLocalStorage('loginStatus');
      if(loginStatus){
        Resource.removeLogin
          .post({}, { matrixContent: loginStatus})
          .then(res => {
            if (res.head.resultCode == 'SUCCESS') {//已发送
              let token = res.head.token;
              LocalStorage.setLocalStorage('token', token, 90 * 24 * 60 * 60 * 1000);
            }
          })
          .catch(err => {
            console.log(err);
          });
      }
      
    },
    locationDetail(address) {
      this.popupVisible = true
      this.detailAddress = address
    },
    chooseRoomVip(data) {
      this.$router.push( {path: '/airportVipForm', query : {bespeakTime:this.$route.query.bespeakTime,'airportCode': this.$route.query.airportCode, 'airportName': this.$route.query.airportName, 'viprName': data.secondarySupplierName } })
    }
  }
};
</script>

<style lang="less" scoped>
@import url("./style.less");
</style>